<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>VUE入门案例</title>
	</head>
	<body>
		<!-- 入门案例步骤
		 1.导入vue.js文件 html下部编辑
		 2.指定区域进行渲染 需要准备div vue.js代码
		 3.创建vue.js对象 指定渲染的区域，动态调用-->
		 <!-- 2.指定区域-->
		 <div id="app">
			<H1>{{msg}}</H1>
			<h1 v-text="msg"></h1>
			<!-- 2.v-html直接渲染html标签 -->
			<div v-html="h3Html"></div>
			<!-- 3.跳过预编译 -->
			<div v-pre>{{msg}}</div>
			<!-- 4.v-once只渲染一次 -->
			<div v-once>{{once}}</div>
		 </div>
		 <!-- 1.导入js文件-->
		 <script src="../js/vue.js"> </script>
		 <!-- 3.创建vue对象-->
		 <script>
			 /* 语法
			 1.const---特点：定义常量的
			 2.let---特点：作用和var类似，有作用域的概念
			 3.var----特点：没有作用域
			 */
			const APP =new Vue({
				//1.注定区域
				el: "#app",
				data: {
					msg: "您好VUE",
					h3Html: "<h1>渲染HTML</h1>",
					once: "我只能被渲染一次"
				}
			})
		 </script>
	</body>
</html>
